<template>
    <div class="bigCardMain"
        style="background: url(https://i.haust.edu.cn/portal-minio/service/%E8%92%B2%E5%85%AC%E8%8B%B1%E8%AF%84%E8%AE%BA%402x-1629702824309.png) 90% bottom / 40% no-repeat">
        <div class="workCardTitle" :style="{ fontSize: 120 / 4 + 'px' }">我的稿件</div>
        <div :style="{ fontWeight: 'bold', fontSize: 120 / 6 + 'px', marginTop: '15px', marginLeft: '10px' }">{{ count }}件
        </div>
    </div>
</template>

<script setup>
import messageAPI from "@/api/message"
import { ref } from "vue"
let count = ref(0)
async function getCount() {
    let qs = await messageAPI.getMyMessage()
    let ns = await messageAPI.getMyMessage(1)
    count.value = qs.data.length + ns.data.length
}
getCount()
</script>
<style scoped>
.workCardTitle {
    font-weight: bold;
    margin-top: 15px
}

.bigCardMain {
    width: 100%;
    height: 100%;
    padding: 10px;
    box-sizing: border-box;
}
</style>
